<template>
    <div class="wrap">
       <headline :title="'设备管理'"></headline>
       <div class="content">
           <el-row class="numBox">
               <el-col :span="12">
                   <div class="IconBox">
                       <img class="userIcon" src="/images/equipmentIcon.png" alt="">
                   </div>
                   <div class="numWrap">
                       <p class="num">103</p>
                       <p>总设备</p>
                   </div>
               </el-col>
               <el-col :span="12">
                   <div class="IconBox">
                       <img class="userIcon" src="/images/equipmentIcon.png" alt="">
                   </div>
                   <div class="numWrap">
                       <p class="num">21</p>
                       <p>异常设备</p>
                   </div>
               </el-col>
           </el-row>
           <equipment_chart class="echart"></equipment_chart>
       </div>
   </div>
</template>
<script setup>
import headline from '../template/headline.vue';
import equipment_chart from './equipment_chart.vue';
import { ref , onMounted } from 'vue'


</script>

<style scoped lang="less">
   
   .wrap{
       overflow: hidden;
       .content
       {
           .numBox{
               color: white;
               margin: 20px;
               .IconBox{
                   width: 50px;
                   height: 60px;
                   line-height: 60px;
                   float: left;
                   .userIcon{
                       width: 100%;
                       height: auto;
                   }
               }
               p{
                   text-align: left;
                   
               }
               .numWrap{
                   padding-left:55px;
                   .num{
                   
                   }
               }
           }
           
       }

       .echart{
           margin-top:-20px;
           margin-left: 10px;
           width: 320px;
           height: 200px;
           overflow: hidden;
       }
   }


</style>